<template>
	<div id="page">
	 <ul>
       <li v-for="item in list" @click="detaile(item.id,item.title)">
           <div>{{item.title}}</div>
           <div>
           <label>作者:{{item.author}}</label>
           <label>发布时间:{{item.createTime | filterTime}}</label>
           <label>阅读次数:{{item.red_num}}</label>
           </div>
       </li> 
       <div class="height_style"></div>
     </ul>	
	</div>
</template>
<script>
	 export default {
        data: function() {
            return {
              list:[]
            }
        },
        created() {
           var _self=this;
           this.api.loadData().then(res => {   
                _self.$store.commit('changeIndexConf', {
                isToast: false,
                })
                _self.list=res.data.data;
             
              
            }).catch(function(error) {
                console.log(error);
            });
            this.$store.commit('changeIndexConf', {
                isFooter: true,
                isHeader: false,
                isToast:  true,
                toastTip:   "正在加载中...",   
            })
           
       
        },
        components: {

        },
        beforeDestroy() {

        },
        computed: {},
        mounted: function() {
          
        },
        methods: {
           detaile:function(id,title){
           
             this.$store.commit('changeIndexConf', {
                isFooter: false,
                isToast:  true,
                toastTip:   "正在加载中...",
               
             })
             this.router.push('/Detail/'+id)
           }
           
        }
    }
</script>
<style lang="scss" scoped>
   @import "../../static/css/home.scss"; 
</style>